VIEWING WEB PAGES ON SMALL SCREEN DEVICES USING A KEYPAD FOR 
NAVIGATION 



DESCRIPTION 

Cross-Reference to Related Applications 

[Para 1] This application is a continuation of co-pending application serial 
number 09/876,070, filed June 8, 2001 , of the same title. 

Field of the Invention 

[Para 2] The invention relates to the display of web pages. More particularly, 
the invention provides a method and system for viewing web pages on a small 
screen device using a keypad for navigation. 

Background of the Invention 

[Para 3] Web pages are typically designed for display on conventional 
computer monitors (RGB, LCD, and the like) that range in size from 1 4" to 21" 
and higher. These conventional computer monitors generally provide screen 
resolutions of 600 x 400 and up, with most users setting their monitors to a 
resolution of 800 x 600 or 1 024 x 768. 

[Para 4] A problem arises when these web pages are displayed on devices 
with screens smaller than the web page's resolution, such as on a mobile 
telephone, personal digital assistant (PDA), or some other communications 
and/or computing device with a small screen. Due to the small size of the 
screen, a web page generally must either be shrunk down to fit the entire page 
on the smaller screen, or scroll bars must be used to move around the page. 
However, text and graphics may be lost or unreadable when the web page is 
shrunk to such a size that it would fit on the smaller screen, and manipulating 
scroll bars on a small screen is often difficult and creates user frustration. 
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[Para 5] One known way of dividing a web page into smaller units is by using 
frames, as are known in the art, that have been predefined within the web 
page. Each frame within a web page behaves similar to individual windows in 
that scrolling up and down or left and right within the frame does not scroll 
the content in other frames within the same web page. Frames have not been 
used to reduce the size of a web page for viewing on small screen devices. 

[Para 6] Another known way of dividing a web page into smaller units is by 
using tables, also known in the art. Tables have not be used to reduce the size 
of a web page for viewing on small screen devices. 

[Para 7] One method of preparing web pages for viewing on small screen 
devices is known as "web clipping," developed by Palm, Inc. of Santa Clara, 
California. Web clipping has been analogized to clipping relevant articles out 
of a newspaper such that a user only receives relevant information. Web 
clipping uses a query (a Palm query application, or PQA), to retrieve specific 
information meeting predefined criteria from the Internet, and transmits the 
retrieved data to the user's handheld device. Web clipping, however, prohibits 
the user from receiving information that may otherwise be retrieved if the user 
views entire web pages instead of "clipped" web pages. 

[Para 8] In recent years services have begun offering web page content 
specifically designed for small screen devices, such as PDAs. These web pages 
generally have smaller sizes, demand less screen color and resolution 
capabilities, and are not graphic intensive. AVANTGO, by AvantCo, Inc. of 
Hayward, California, is an example of such a service. 

[Para 9] While these smaller web pages are easier to display on small screen 
devices, there is still a problem navigating around these web pages on small 
screen devices. While PDAs typically allow a user to navigate in a point-and- 
click fashion using a stylus, other small screen devices, such as mobile 
telephones, typically do not offer such a feature. Instead, they rely on 
awkward and non-intuitive keystrokes on a keypad to navigate through a web 
page and its associated links. Another problem is that these web pages 
typically do not include as much information as a more conventionally sized 
web page. 
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[Para 1 0] Some mobile telephones offer mini-browser applications with which 
users can navigate web pages. However, current implementations do not 
support switching between different sections of a web page, nor do current 
implementations support visualization of different sections of a web page. 
Thus, presently known mini-browsers do not optimize web page navigation 
capabilities on small screen devices 

[Para 1 1 ] Thus, it would be an advancement in the art to develop an improved 
method and system that can display a web page on a small screen device, and 
allow a user to logically navigate the web page and its associated links. 

[Para 1 2] It would also be an advancement in the art to develop an improved 
method and system that can be used for navigating web pages on small screen 
devices that rely on a keypad for navigation. 

SUMMARY OF THE INVENTION 

[Para 13] In a first embodiment of the invention, there is a method for 
displaying a web page that has been divided into sections, where each section 
is associated with at least one of a plurality of selectable labels. The method 
includes receiving user input corresponding to a selected label, and displaying 
on a screen the section of the web page associated with the selected label. 

[Para 14] In a second embodiment of the invention, there is a mobile terminal 
for displaying web pages. The mobile terminal includes a display, a keypad, a 
processor, and a memory for storing computer readable instruction that, when 
executed by the processor, cause the device to perform a set of steps. The 
mobile terminal receives user input corresponding to a selected label, and 
displays on the screen a section of the web page associated with the selected 
label, where the web page has been divided into sections and each section has 
been associated with at least one of a plurality of labels. 

[Para 15] In a third embodiment, there is a mobile terminal that has a display, 
a keypad, a processor, and a memory for storing computer readable 
instruction that, when executed by the processor, cause the device to perform 
a set of steps. The mobile terminal stores in the memory a web page that has 
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been divided into sections, and stores association information in tPie memory. 
TPie association information includes an association of each section of tPie web 
page with at least one corresponding key on the keypad. The mobile terminal 
displays a mapping screen on the display, and receives user input 
corresponding to a selected key on the keypad. In response to receiving the 
user input, the mobile terminal displays on the display a section of the web 
page associated with the selected key. 

[Para 16] In a fourth embodiment of the invention, there is a method for 
displaying web pages on a device, including the steps of storing in a memory a 
web page, wherein the web page has been divided into sections; storing 
association information in the memory, wherein the information includes an 
association of each section of the web page with at least one corresponding 
key on the keypad; displaying a mapping screen on a display; receiving user 
input corresponding to a selected key; and displaying on the display a section 
of the web page associated with the selected key. 

[Para 1 7] In some embodiments, the labels may be icons displayed on the 
screen. 

[Para 1 8] In other embodiments, the labels may be keys on a device keypad. 
BRIEF DESCRIPTION OF THE DRAWINGS 

[Para 1 9] Figure 1 shows a mobile telephone for use in an embodiment of the 
invention. 

[Para 20] Figure 2 shows a web page divided into sections for use in an 
embodiment of the invention. 

[Para 21] Figure 3 shows an alphanumerical keypad divided into sections 
corresponding to the web page sections shown in Figure 2. 

[Para 22] Figure 4 shows a flowchart of a method of performing an 
embodiment of the invention. 

[Para 23] Figure 5 shows a portion of a web page displayed on a small screen 
device with an icon 301 indicating the portion of the web page displayed. 
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[Para 24] Figure 6 shows icons that may be used to represent various portions 
of a web page. 

[Para 25] Figure 7 shows a section-l<eys mapping screen for use in an 
embodiment of the invention. 

[Para 26] Figure 8 shows a section-icon mapping screen for use in an 
embodiment of the invention. 

[Para 27] Figure 9 shows a screen displaying a Main Body section of a web 
page according to an embodiment of the invention. 

[Para 28] Figure 1 0 shows a screen displaying a IVIenu List section of a web 
page according to an embodiment of the invention. 

[Para 29] Figure 1 1 shows a screen displaying a IVIain Body section of a web 
page according to an embodiment of the invention. 

[Para 30] Figure 1 2 shows a screen displaying a IVIenu List section of a web 
page according to an embodiment of the invention. 

DETAILED DESCRIPTION OF THE INVENTION 

[Para 31] The invention may be embodied in a method and system for 
navigating web pages on a small screen device, as herein described with 
respect to Figures 1 -1 2. Web pages may include any file that may be viewed 
over the Internet using a browser. These files include those created using 
HTML, XML, WAP, PQA, ASP, CGI, Java, JavaScript, and any other programming 
language or protocol that may be used to create and/or serve web pages over 
the Internet or another network. 

[Para 32] In one embodiment, the invention may be used in a mobile 
telephone or terminal 1 01 , shown in Fig. 1 , or any other device with a display 
and a keypad that may be used to view web pages. Some embodiments may 
also be used with devices utilizing a stylus or other pen-input device. The 
mobile telephone 1 01 has a display 1 03, keypad 1 05, speaker 1 07, 
microphone 1 09, and communications antenna 1 1 1 . A user may use the 
keypad 105 to navigate/ browse a web page 201 , shown in Fig. 2. The mobile 
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telephone may also include a processor and a memory (not shown), as is 
known in the art. The memory may be used to store computer readable 
instructions that, when executed by the processor, cause the mobile telephone 
to perform in accordance with the Invention. 

[Para 33] The mobile telephone 1 01 may be communicatively linked to a 
server 1 1 3 through which web pages are served to the mobile telephone. The 
server 1 1 3 may have a processor 1 1 5, communications equipment 1 1 7, and 
memory 1 1 9. The memory may store a database 1 21 containing web pages 
for serving to the mobile telephone 1 01 . Alternatively, web pages may be 
stored on other web servers, as is known In the art, and the server 1 1 3 would 
retrieve a requested web page from another server on which It Is located, and 
then serve the requested web page to the mobile telephone. 

[Para 34] For use with the invention as described herein, each web page may 
be divided into sections. In the present example, web page 201 is divided into 
Sections A, B, C & D. Preferably, the sections are logical divisions of the web 
page, such as preexisting frames or tables within the web page, as are known 
in the art. Sections, however, are not required to correspond to frames when 
frames are present. Other bases for dividing a web page into sections include 
menu layouts on the web page, advertisements at the top and/or bottom of 
the page, lists of related hyperlinks, groups of text, etc. For example. In Fig. 
2, Section A may correspond to an advertisement at the top of the web page. 
Section B may correspond to a menu on the left side of the web page. Section 
C may correspond to a main body of the web page, including text, links, etc., 
and Section D may correspond to a list of related web sites that may provide 
additional information to the user. One skilled In the art may easily envision 
other bases for dividing each web page. 

[Para 35] Each section preferably is created so that it may easily be displayed 
on a small screen device. While each section, however, may be larger than the 
screen 1 03 of the device 1 01 , each section should be able to be viewed easily, 
such as by scrolling, on the screen. The division of each web page Into 
sections may be performed manually, such as by a page author, or 
automatically by a computer. The computer dividing the web page Into 
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sections may be the same device 1 01 that displays the page, or it may be a 
separate device, such as one that serves the web page to the device 101 for 
viewing. In one embodiment, where a computer other than the device 1 01 
divides the web page into sections, sections may be transmitted to the device 
101 as a user requests them. In another embodiment, the entire web page, 
i.e. all the sections, may be transmitted to the device at approximately the 
same time. However, in the present invention, how a web page is divided is 
secondary to how the web page is navigated after it has been divided. 

[Para 36] After a web page 201 is divided into sections, each section is 
associated with one or more keys on a keypad, in this example with one or 
more of the keys 0-9, *, and # on the keypad 1 05. The sectional associations 
may be stored in the memory of device 1 01 . Fig. 3 shows a set of key 
assignments that may be used with respect to the web page 201 . In Fig. 3, a 
first set 205 of keys 1 -3 is associated with Section A, a second set 207 of keys 
4, 7 and * is associated with Section B, a third set 209 of keys 5, 8 and 0 is 
associated with Section C, and a fourth set 21 1 of keys 6, 9 and # is associated 
with section D. 

[Para 37] In one embodiment, for instance where a computer serving web 
pages to the device 101 has information corresponding to the device's keypad, 
the server computer may perform the sectional associations and send 
information regarding the associations to the device. In another embodiment, 
for instance where the computer serving web pages to the device does not 
have information regarding the device's keypad 105, the device 101 may 
perform the sectional associations and store them in memory. 

[Para 38] After the associations have been loaded and activated, when a user 
presses any key on the keypad, the corresponding section of the web page 
may be displayed on the device display 1 03. For example, as shown in Fig. 1 1 , 
a user pressing key 5 may cause a main body of the web page, corresponding 
to Section C, to be displayed on the display 1 03. Similarly, as shown in Fig. 
1 2, a user pressing key 4 causes a menu list, corresponding to Section B, to be 
displayed on the display 103. 
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[Para 39] In one embodiment, where more than one key may be associated 
with the same section of a web page, and where that section may be larger 
than the size of the display 1 03, the section may be displayed with the top left 
corner of the section in the top left corner of the display, regardless of which 
associated key is pressed. For instance, in the above example, if Section A is 
wider than the display 1 03, the beginning of Section A is displayed on the 
display 1 03 regardless of whether key 1 , 2 or 3 is pressed. 

[Para 40] In another embodiment, also where more than one key may be 
associated with the same section of a web page, and where a section may be 
longer and/or wider than the display 1 03, sections may be further subdivided 
into subsections, such that a portion of the web page may be displayed 
corresponding to the subsection associated with the pressed key. For 
instance, in the above example, when a user presses key 4, the beginning of 
Section B may be displayed on the display device. However, when a user 
presses key 7, the middle portion of Section B may be displayed. In another 
embodiment, the first time a user presses key 7 the beginning portion of 
Section B may be displayed, and if the user again presses key 7 without having 
pressed any intervening keys, the middle portion of Section B may displayed 
on the device display 1 03. In this manner a user may easily navigate to a 
section and further to a subsection of a web page with a minimal amount of 
keystrokes. 

[Para 41 ] With reference to Fig. 5, because only a portion of the web page 
may be shown at any given time, a graphic or icon 301 may be displayed on 
the device display to indicate to the user the portion of the web page that is 
being displayed. For instance, icon 301 may be an iconic depiction of a 
keypad with a portion of the keypad shaded to correspond to the displayed 
section. Fig. 5 shows Section C of web page 201 displayed on device display 
103, including icon 301 indicating the specific section, i.e. Section C, of the 
web page 201 that is displayed. Fig. 6 shows icons that may be used for 
Sections A-D, respectively. While the icons in Fig. 6 resemble the keypad, each 
icon is principally designed to represent the displayed portion of the web page. 
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[Para 42] When each web page is first displayed, the user may not l<now which 
l<eys are mapped to each section of the web page, nor may the user l<now the 
section divisions within the web page. With reference to Fig. 7, a mapping 
screen 31 1 may be displayed that informs the user of the key mappings to 
each section. The mapping screen may also include, as shown, a short 
description of each section's contents. 

[Para 43] Each device 1 01 may be programmed such that the key mappings 
are only active when the user is browsing a web page and is not inputting 
information, e.g. into a web page form. Thus, when a user needs to use the 
keypad 1 05 for a conventional purpose, the key mappings will not interfere 
with such use. The device may activate the key mappings upon detecting that 
a user has either selected a hyperlink displayed on the display 1 03, or has 
selected activation of a browse mode. Upon entering browse mode, the device 
may display the user's home page in accordance with the invention as 
described above. 

[Para 44] In another embodiment, with reference to Fig. 8, each section of the 
web page may be associated with an icon instead of with a button on the 
keypad. Each icon is preferably one that can be easily remembered by a user. 
In this embodiment, a mapping screen 321 may initially be displayed that 
identifies the icons 323 - 329 associated with each section of the web page. 
The icons may be numbers, letters, or some other easily identifiable icon, such 
as the club, diamond, heart, or spade shown in Fig. 8. An additional icon 331 
may be used to correspond to the mapping screen. 

[Para 45] Upon viewing the mapping screen 321 , a user may select one of the 
sections using any method, button, or other means known to one skilled in the 
art, such as through the use of special navigation buttons (not shown) on the 
device 1 01 . When the user selects the section that he or she wants to view, 
the device displays the selected section's contents on the device display 1 03 in 
a section screen 331 , as shown in Fig. 9. Fig. 9 shows section C, or the main 
body, of web page 201 displayed on the device display 103 according to this 
embodiment of the invention. 
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[Para 46] In addition to tPie contents of the selected section, the device may 
also display the icons 323-331 on the screen. By displaying the icons 323- 
331 on the screen, the user may directly select one of the icons associated 
with another section of the web page. Upon selecting a section icon, the 
device displays that section on the display 103. For example, if the user 
selects the diamond icon 325, the Menu List will be displayed. Fig. 1 0 shows a 
section screen 335 displaying the Menu List of the web page 201 . The user 
may alternatively select the icon 331 associated with the mapping screen 321 
in order to review the section-icon associations. 

[Para 47] Optionally, on each section screen, the icon representing the 
displayed section may be highlighted, underlined, or displayed in some other 
way to indicate that the section corresponding to that symbol is presently 
being displayed. For example, in Fig. 9, the heart, which corresponds to the 
Main Body of the web page, is underlined to indicate that the Main Body of the 
web page is presently displayed, while in Fig. 1 0 the diamond is underlined to 
indicate that the Menu List is presently displayed. 

[Para 48] A method for displaying a web page on small screen device will now 
be discussed with reference to Fig. 4. In step 151, the web page is divided 
into sections, as described above. This can be done manually or, where 
appropriate, automatically by computer. Each section is associated, in step 
1 53, with one or more selectable labels. In one embodiment, the selectable 
labels are keys on the keypad 105. In this embodiment, the labels may be 
selected by pressing the associated key on the keypad. In another 
embodiment, the selectable labels may be icons or graphics on the display 
1 03. In this embodiment, the labels may be selected by using known 
technologies, such as navigation buttons, a stylus, and the like, to select the 
icon on the display. 

[Para 49] The small screen device, in step 1 55, detects user input indicating 
that a web page is to be viewed on the display 1 03. In response to the user 
input received in step 1 55, a mapping screen (as described above) is displayed 
in step 1 57 on the display 1 03. The selectable labels are activated in step 
1 59. In the embodiment where the selectable labels are keys on the device 
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keypad, activation comprises activating the section-l<ey associations so tPiat 
wPien a user presses a key on the keypad, the corresponding section of the 
web page Is displayed. In the embodiment where the selectable labels are 
graphics or Icons displayed on the display 103, activation comprises displaying 
the graphics or Icons on the display 1 03 such that a user may select one of 
them in order to display a corresponding section of the web page. After the 
labels have been activated, the device waits for user input corresponding to a 
selected label, detected In step 161. In step 1 63 the device displays the 
section of the web page corresponding to the selected label. 

[Para 50] Those skilled in the art will appreciate that the above-recited steps 
may be performed in other than the recited order, and that some steps may be 
optional. For Instance, at least steps 1 57 and 1 59 may be reversed, and at 
least step 1 57 Is optional. 

[Para 51] The above-described method and system may be used to logically 
and efficiently navigate a web page on a small-screen device. The invention 
allows a user to quickly move from one section of a web page to another, while 
indicating the section which the user Is presently viewing. The invention is not 
mutually exclusive of other forms of web page navigation, and may be used in 
conjunction with other forms of navigation. For instance, even when the 
selectable labels are active, hyperlinks on the displayed sections of the web 
page may be selected In a conventional manner using known technologies. 

[Para 52] While the invention has been described with respect to specific 
examples including presently preferred modes of carrying out the invention, 
those skilled In the art will appreciate that there are numerous variations and 
permutations of the above described systems and techniques that fall within 
the spirit and scope of the Invention as set forth In the appended claims. 
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